$(function () {
    var role_datagrid = $("#role_datagrid");
    var role_dialog = $("#role_dialog");
    var role_allPermissions = $("#allPermissions");
    var role_selfPermissions = $("#selfPermissions");
    
    role_datagrid.datagrid({
        url:"/role/list",
        fit:true,
        columns:[[
            {field:'x',checkbox:true},
            {field:'id',title:'编号',width:100,hidden:true}, //hidden 隐藏显示该列
            {field:'name',title:'角色名称',width:100},//允许列改变大小
            {field:'sn',title:'角色编号',width:100}
        ]],
        rownumbers:true,
        striped:true,
        toolbar:"#role_toolbar",
        pagination:true,
        fitColumns:true,
    })
    //弄出一个用于输入员工信息的对话框//
    //因为对话框在编辑与添加是公用同一个, 所以页面加载完毕时候提前初始化, 在点击添加与编辑时候,直接显示出来即可
    role_dialog.dialog({
        width:600,
        height:400,
        buttons:"#bb",
        closed:"true"
    })

    var allData = {}; //缓存系统权限数据
    //所有权限
    role_allPermissions.datagrid({
        width:300,
        height:300,
        url:"/permission/list",
        title:"系统权限",
        fitColumns:true,
        rownumbers:true,
        striped:true,
        singleSelect:true,
        columns:[[
            {field:'id',title:'编号',width:100,hidden:true}, //hidden 隐藏显示该列
            {field:'name',title:'权限名称',width:100, align:"center"},//允许列改变大小
        ]],
        onDblClickRow:function (index,row) {
            role_allPermissions.datagrid("deleteRow",index);
            role_selfPermissions.datagrid("appendRow",row);
        },
        onLoadSuccess:function (data) {
            //这是地址赋值, 移走数据后, allData会变化, 我们需要的是全部的不变的, 应该采用拷贝值的方式
            //allData = data;  //缓存加载的所有权限, 添加操作要用
            allData = $.extend(true,{},data);
            console.log(allData)
        }

        })

    //自己拥有的权限
    role_selfPermissions.datagrid({
        width:300,
        height:300,
        title:"自身权限",
        fitColumns:true,
        rownumbers:true,
        striped:true,
        singleSelect:true,
        columns:[[
            {field:'id',title:'编号',width:100,hidden:true}, //hidden 隐藏显示该列
            {field:'name',title:'权限名称',width:100, align:"center"},//允许列改变大小
        ]],
        onDblClickRow:function (index,row) {
            role_selfPermissions.datagrid("deleteRow",index);
            role_allPermissions.datagrid("appendRow",row);
        },
        //去除左边的重复数据
        onLoadSuccess:function (data) { //数据加载成功响应事件
            //去除重复权限: 现在找自身权限,然后删除系统权限中重复的权限(以id为媒介)
            //1.查找自身权限id集合, 把一个数组变成一个新的数组
            var ids = $.map(data.rows, function (item) {
                return item.id;
            })
            //2.查找系统权限集合
            var rows = role_allPermissions.datagrid("getRows");
            //因为数组是先进先出的, 删除之后, 索引会变化, 从后面删除
            for(var i = rows.length-1; i>=0; i--){
                //判断id是否存在id数组中
                if($.inArray(rows[i].id, ids) >= 0){
                    //存在: 删除该数据
                    role_allPermissions.datagrid("deleteRow",i);
                }
            }
        }
    })



    //弄出一个用于输入员工信息的对话框
    //因为对话框在编辑与添加是公用同一个, 所以页面加载完毕时候提前初始化, 在点击添加与编辑时候,直接显示出来即可
    role_dialog.dialog({
        width:600,
        height:400,
        buttons:"#bb",
        closed:"true"
    })




    var cmdObj = {
        //刷新列表数据
        reload: function () {
                role_datagrid.datagrid("reload");
        },

        //编辑操作
        edit: function () {
        //因为编辑与添加公用一个对话框,所以在操作之前应该将以前的数据清空
        $("#role_form").form("clear");
        //从datagrid中获取选中的那一行数据
        var row = role_datagrid.datagrid("getSelected");
        console.log(row);
        if(!row){
            $.messager.alert("温馨提示","请选择要编辑的行");
        }else{
            //打开编辑对话框
            role_dialog.dialog("setTitle","编辑角色");
            role_dialog.dialog("open");
            //将选中row数据加载到对话框中的form表单中,用于回显
            //form加载数据原理: 根据同名匹配原则
            console.log(row);
            //将数据加载到form表单中
            $("#role_form").form("load",row);//数据回显

            //从缓存中加载系统权限, role_selfPermissions将重复的移除。
            role_allPermissions.datagrid("loadData",allData);

            //加载当前编辑角色具有的权限
            //1.设置url
            var options = role_selfPermissions.datagrid("options"); //获取现在自身的属性对象
            options.url = "/permission/queryPermissionByRoleId?roleId=" + row.id;
            //重新加载数据
            role_selfPermissions.datagrid("load");
        }
    },

        //添加操作
        add: function(){
        //因为编辑与添加公用一个对话框,所以在操作之前应该将以前的数据清空
        $("#role_form").form("clear");
        //打开添加对话框
        role_dialog.dialog("setTitle","添加角色");
        role_dialog.dialog("open");
        //将自身的权限情况
        role_selfPermissions.datagrid("loadData",{"total":0,"rows":[]});
        //重新加载左边的所有权限
        role_allPermissions.datagrid("loadData",allData);
    },
        //保存
        save: function() {
        //获取id
        var id = $("#roleId").val();
        //因为编辑与添加公用对话框中同一个保存按钮,所以需要根据id来判断添加还是编辑操作
        var url="/role/save";
        if(id){
            url="/role/update";
        }
        //提交表单
        $("#role_form").form("submit",{
            //表单提交路径
            url:url,
            //操作成功之后执行该函数, data是返回的数据
            //注意:data是json格式的字符串
            onSubmit: function(param){
                //返回当前页的所有行
                var rows = role_selfPermissions.datagrid("getRows");
                for(var i=0; i < rows.length; i++){
                    //param是一个对象, 可以自定义它的属性名
                    param["permissions["+i+"].id"] = rows[i].id;
                }
            },
            success: function(data){
                //1.接受返回数据
                //2.判断操作是否成功
                data = $.parseJSON(data);
                console.log(data);
                console.log(data.succeed);
                //3.操作失败,提示用户
                if (!data.succeed){
                    $.messager.alert('温馨提示',data.errorMsg);
                }else{
                    //4.操作成功
                    //4.1提示用户操作成功
                    $.messager.alert('温馨提示',"保存成功");
                    //4.2关闭当前的输入对话框
                    role_dialog.dialog("close");
                    //4.3属性datagrid的数据, 重新刷新页面的数据
                    role_datagrid.datagrid("reload");
                }
            }

        })
    },
        //删除
        remove: function () {
        //从datagrid中获取选中的哪一行数据
        var row = role_datagrid.datagrid("getSelected")
        if(!row){
            $.messager.alert("温馨提示","请选择要编辑");
        }else{
            $.messager.confirm("确认", "你确认想要执行这个操作?",function(r){
                if(r){
                    //1.发起请求修改状态
                    $.get("/role/delete",{id:row.id},function(data){
                        if(!data.succeed){
                            $.messager.alert("温馨提示",data.errorMsg);
                        }else{
                            //刷新列表数据
                            role_datagrid.datagrid("reload");
                        }
                    })
                }
            });
        }
    },
        //关闭对话框
        cancel:function() {
        role_dialog.dialog("close");
    },
        //高级查询
        query:function() {
        //因为easyui对元素的html进行相关封装,可能导致获取到数据,建议使用easyui提供获取数据的方法
        //var keyword = $("#keyword").val();
        var keyword = $("#keyword").textbox("getValue");

        //所谓高级查询, 无非是让datagrid根据条件去更新列表数据,所以只需要刷新列表, 同时携带查询条件即可
        role_datagrid.datagrid("load",{
            keyword:keyword,
        })
    }
    }

    //调用
    $("a[data-cmd]").click(function () {
        var cmd = $(this).data("cmd");
        cmdObj[cmd]();
    })
})











